﻿<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
    <link type="text/css" rel="stylesheet" href="contextMenu.css" />
    <script type="text/javascript" src="contextMenu.js"></script>
    <style>
        .hidden
        {
            display:none;
        }
    </style>
</head>
<body>
    <div id="MenuDiv">TestContentMenu</div>
    <div id="closeButton">close</div>
    <script type="text/javascript">
        var menu = [{
            name: 'create',          
            title: 'create button',
            fun: function () {
                alert('i am add button')
            }
        }, {
            name: 'update',       
            title: 'update button',
            fun: function () {
                alert('i am update button')
            }
        }, {
            name: 'delete',          
            title: 'create button',
            fun: function () {
                alert('i am add button')
            }
        }];

        $('#MenuDiv').contextMenu(menu, { onOpen: OnMeunOpen });

        function OnMeunOpen(data, e) {
            // alert("open");
            // iw-contextMenu          
            // data.menu.selector
            var menus = document.querySelectorAll(data.menu.selector + " li");
            for (var index = 0; index < menu.length; index++) {
                if (menus[index].classList.contains("hidden")) {
                    menus[index].classList.remove("hidden");
                }
            }


            var hiddenMenu = document.querySelector(data.menu.selector + " li[title='create button']");
            hiddenMenu.setAttribute("class", "hidden");

            hiddenMenu = document.querySelector(data.menu.selector + " li[title='update button']");
            hiddenMenu.setAttribute("class", "hidden");
            data.deltaHeight = 25.4 * 2;            
        }

        window.onbeforeunload = function (sender,arg) {
            alert("请不要离开,系统正在创建群组");
            var closeButton = document.getElementById("closeButton");
            closeButton.onclick = function () {
                window.close();
            }
            return false;
            // return "Are you sure?";
        };

        // Hide the dialog button on the parent window
        // .ms-dlgTitleBtns

        // Hook the onclick event for cancel in the iframe window

        // Use a sign var in the parent window 

        // Hook the .ms-addnew button onclick event

        // Open the modal dialog by javascript,once use click submit, then don't allow leave until user cancel the submit complete

        // http://www.jstree.com/
    </script>
</body>
</html>
